
<div class="card">
  <h5>Database Management User</h5>
  <p-table [value]="UList" (sortFunction)="customSort($event)" [customSort]="true">
    <ng-template pTemplate="header">
      <tr>
        <th pSortableColumn="id">ID <p-sortIcon field="id"></p-sortIcon></th>
        <th pSortableColumn="name">Name <p-sortIcon field="name"></p-sortIcon></th>
        <th pSortableColumn="gender">Gender <p-sortIcon field="gender"></p-sortIcon></th>
        <th pSortableColumn="birthday">Birthday <p-sortIcon field="birthday"></p-sortIcon></th>
        <th pSortableColumn="phoneNum">PhoneNum <p-sortIcon field="phoneNum"></p-sortIcon></th>
        <th pSortableColumn="homeAddress">HomeAddress <p-sortIcon field="homeAddress"></p-sortIcon></th>
      </tr>

      <tr *ngFor="let col of UList">
        <th>
          {{col.id}}
        </th>
        <th>
          {{col.name}}
        </th>
        <th>
          {{col.gender}}
        </th>
        <th>
          {{col.birthday | date:'MM/dd/yyyy'}}
        </th>
        <th>
          {{col.phoneNum}}
        </th>
        <th>
          {{col.homeAddress}}
        </th>

      </tr>

    </ng-template>

  </p-table >
</div>
